<template>
	<view class="container">
		<view class="charts-box">
			<!-- 此处改变的是 seriesTemplate 模板中的默认配置，不必每个series都传smooth:true，将会覆盖:chartData.series 实现更低的代码量 -->
			<qiun-data-charts type="line" :opts="{extra:{line:{type:'curve'}}}" :eopts="seriesTemplate"
				:chartData="chartsDataLine1" :echartsH5="true" :echartsApp="true" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 样式配置
				seriesTemplate: {
					yAxis: {
						max: 60,
						axisLabel: {
							formatter: '{value}°C'
						}
					}
				},
				chartsDataLine1: {},
				//横向柱状图的配置，您也可以把默认配置写在config-echarts.js中
				columneopts: {
					grid: {
						left: '3%',
						right: '4%',
						bottom: 30,
						top: 10,
						containLabel: true
					},
					xAxis: {
						type: 'value',
						axisLine: {
							show: false
						},
						axisTick: {
							show: false
						},
					},
					yAxis: {
						type: 'value',
						data: []
					},
				}
			};
		},
		onReady() {
			this.getServerData();
		},
		methods: {
			getServerData() {
				this.chartsDataLine1 = {
					"categories": ["05-01", "05-03", "05-04", "05-05", "05-06", "05-07"],
					"series": [{
						"name": "患者体温",
						"data": [35, 36.5, 38.2, 37, 36.2, 35.7]
					}]
				}
			},
			complete(e) {
				console.log("渲染完成事件", e);
			},
			getIndex(e) {
				console.log("获取点击索引事件", e);
			}
		}
	};
</script>

<style>
	page {
		background-color: #fff;
	}

	.content {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.charts-box {
		width: 100%;
		height: 300px;
	}
</style>